import React, { Component } from 'react';
import { connect } from 'react-redux'  
import { Modal, Form, Input,Select ,Table,Button, Popconfirm} from 'antd';

var _this,_props,_state;

const FormItem = Form.Item;

class ArrivalDetailModal extends Component {
  constructor(props) {
    super(props);
  }
 
  okHandler = () => {
     const { onOk } = this.props;
     this.props.form.validateFields((err, values) => {
      if (!err) {
        onOk(values);
      }
     });
  };

  onEditItem(id){
    const { onSelectDetailInfo } = _props;
     onSelectDetailInfo(id);
  }

  render() {
    _this = this;
    _state = this.state;
    _props = this.props;   

    const { children, dispatch,roomList,detailList, } = this.props;
    const { getFieldDecorator } = this.props.form;  

    const formItemLayout = {
      labelCol: { span: 6 },
      wrapperCol: { span: 14 },
    };
    const columns = [{
      title: '资产编号',
      dataIndex: 'assetNo',
      key: 'assetNo',
      width: 100,
    },{
      title: '资产分类',
      dataIndex: 'typeName',
      key: 'typeName',
      width: 100,
    },{
      title: '设备名称',
      dataIndex: 'assetName',
      key: 'assetName',
      width: 100,
    },{
      title: '品牌',
      dataIndex: 'brandName',
      key: 'brandName',
      width: 100,    
    },{
      title: '设备型号',
      dataIndex: 'modelName',
      key: 'modelName',
      width: 100,
    },{
      title: 'RFID号',
      dataIndex: 'rfidNo',
      key: 'rfidNo',
      width: 100,
    },{
      title: '资产序列号',
      dataIndex: 'serialNo',
      key: 'serialNo',
      width: 100,
    },{
      title: '价格',
      dataIndex: 'price',
      key: 'price',
      width: 100,
    },{
      title: '备注',
      dataIndex: 'remark',
      key: 'remark',
      width: 120,
    },{
      title: '状态',
      dataIndex: 'status',
      key: 'status',
      width: 60,
      render: (text, record) => {
        if (record.status == 1) {
          return '预置';
        };
        if (record.status ==2) {
          return '已验收';
        };    
      },
    },{
      title: '操作',
      key: 'operation',
      width: 80,
      render: (text, record) => (
          <span>
              {(() => {
              switch (record.status) {
                case 1: return <a onClick={this.onEditItem.bind(null, record.id_)}>验收</a>;
                case 2: return <span>验收完成</span>;
             }
             })(record)}                   
          </span>
      ),
    }];  
   
    return (
      <span>
        <Modal
                maskClosable= {this.props.maskClosable}
                confirmLoading= {this.props.confirmLoading}
                title={this.props.title}
                style={{ top: 50}}
                width={1000}
                zIndex={100}
                visible={this.props.visible}
                footer={[
                  <Button  key="close" type="primary" size="large" onClick={this.props.onCancel}>关闭</Button>
                ]}
                onCancel={this.props.onCancel}
                key={this.props.newKey}
        >
          <div style={{width:'auto',height:document.body.clientHeight - 216,position:'relative',backgroundColor:'#fff'}}> 
              <div style={{minHeight:'100%'}}>                
                  <div style={{width:'100%',height:'100%',paddingLeft:'20px'}}>
                    <Table columns={columns}
                        rowKey={record => record.id_}                  
                        dataSource={this.props.detailList} 
                        pagination={false} 
                        scroll={{ x:900,y:document.body.clientHeight - 240 }}
                  />
                  </div>
              </div>     
         </div>  
        </Modal>      
        
      </span>
    );
  }
    
}

export default Form.create()(ArrivalDetailModal)
